import React, {
    Component,
} from 'react';

import {
    StyleSheet,
    Text,
    View,
    Platform,
    FlatList,
    Dimensions,
    TouchableOpacity,
    Image,
    ScrollView,
    StatusBar,
    Linking,
    ActivityIndicator,
    DeviceEventEmitter,
    TextInput,
    AsyncStorage,
} from 'react-native';

import HttpUtils from "../../utils/HttpUtils";
import HttpUrls from "../../utils/HttpUrls";
import Constant from '../../utils/Constant'//全局变量
import Header from "../../components/header";
import { ToastToUser } from '../../utils/CustomToast';
import Loading from "../../utils/Loading";

import { WebView as HXCommonWebView } from "react-native-webview";

const isIos = Platform.OS == 'ios';
const screenW = Dimensions.get('window').width;
const screenH = Dimensions.get('window').height;

let navigation

// const h5Url = 'https://m.shuaiche.com/pdfView?url=';
// const h5Url = 'https://m-dev.shuaiche.com/pdfView?url=';

export default class PrivewContractPage extends Component {

    constructor(props) {
        super(props);
        this.state = {
            urlFinal: '',
            templateId: '',
            templateName: '',
            chooseType:''
        }
    }

    componentWillUnmount() {

    }

    componentWillMount() {

    }


    componentDidMount() {
        let url = this.props.route.params.fileDownloadUrl
        let id = this.props.route.params.templateId
        let name = this.props.route.params.templateName
        let choose=this.props.route.params.chooseType
        //    url="https://m-dev.shuaiche.com/preview?url=https%3A%2F%2Freport.hx2car.com%2F17364761230611780814261.pdf,https%3A%2F%2Freport.hx2car.com%2F17364761230611780814261.pdf,https%3A%2F%2Freport.hx2car.com%2F17364761230611780814261.pdf,https%3A%2F%2Freport.hx2car.com%2F17364761230611780814261.pdf"
        console.log('url', url)
        if(this.Loading){
            this.Loading.show();
        }
        this.setState(
            {
                urlFinal: Constant.webDomain + '/pdfView?url=' + url,
                // urlFinal:url,
                // urlFinal:'https://esignoss.esign.cn/esignoss/83ccf58b-cd73-4572-bccd-56ec48580564/shuaiche_face.pdf?Expires=1737429196&OSSAccessKeyId=LTAI4G23YViiKnxTC28ygQzF&Signature=rjhU82EBdMboWGhwfzKUXyFAwK4%3D',
                templateId: id,
                templateName: name,
                chooseType:choose
                // urlList:url.split(',')
            }, function () {

            });
    }



    render() {
        navigation = this.props.navigation
        let bottomHeight = Constant.isIPhoneX ? Constant.bottomHeight + 50 : 50
        let bottom = (this.state.templateId == -1) ? 0 : bottomHeight

        return (
            <View style={styles.container}>
                <Header navigation={navigation} Title={'合同预览'} />
                {/* <FlatList
                    data={this.state.urlList}
                    keyExtractor={(item, index) => index.toString()}
                    renderItem={this.renderItemView.bind(this)}
                /> */}
                <HXCommonWebView style={[styles.container, { marginBottom: bottom }]} source={{ uri: this.state.urlFinal }}  
                    onLoadEnd={() => {
                        setTimeout(() => {
                            this.hideLoading()
                        },2500)
                        
                    }}
                    onError={(error) => {
                        this.hideLoading()
                    }}/>


                {
                    this.state.templateId == -1
                        ?
                        null
                        :
                        <View style={[styles.bottombtns, { height: Constant.isIPhoneX ? Constant.bottomHeight + 50 : 50 }]}>
                            <View style={styles.bottombtns1} >
                                <TouchableOpacity style={styles.leftBtn}
                                    onPress={this.change.bind(this)}>
                                    <Text style={styles.btnTitle}>切换模板</Text>
                                </TouchableOpacity>
                                <TouchableOpacity style={styles.rightBtn}
                                    onPress={this.submit.bind(this)}>
                                    <Text style={styles.btnTitle}>立即填写</Text>
                                </TouchableOpacity>
                            </View>
                        </View>
                }

                <Loading onRef={(ref) => (this.Loading = ref)} />


            </View>
        )
    }

    hideLoading(){
        if(this.Loading){
            this.Loading.hide();
        }
    }

    //立即填写
    submit() {
        let obj = {
            typepage: '1033',
            templateId: this.state.templateId,
            templateName: this.state.templateName,
            isFinish: '1',
            chooseType:this.state.chooseType,
        }
        navigation.replace('SignatoryPage', obj)
    }

    //切换模板
    change() {
        navigation.goBack()
    }

    renderItemView({ item, index }) {
        return (
            <View>
                {/* <Text>{item}</Text> */}
                <HXCommonWebView style={styles.container} source={{ uri: item }} />
            </View>
        )
    }


}

const styles = StyleSheet.create({

    container: {
        width: screenW,
        flex: 1,
        backgroundColor: '#f6f6f6'
    },

    bottombtns: {
        position: 'absolute',
        bottom: 0,
        height: 50,
        width: screenW,
        flexDirection: 'row',
        alignItems: 'flex-start'
    },
    bottombtns1: {
        height: 50,
        width: '100%',
        flexDirection: 'row',
    },

    leftBtn: {
        width: 150,
        height: 50,
        backgroundColor: '#F5F5F5',
        alignItems: 'center',
        justifyContent: 'center',
    },

    rightBtn: {
        height: 50,
        backgroundColor: '#FFE000',
        alignItems: 'center',
        justifyContent: 'center',
        flex: 1
    },

    btnTitle: {
        fontWeight: '400',
        fontSize: 16,
        color: '#333333',
    }



})